import React from 'react';
import { Form, InputNumber, Input, Select, Slider } from 'antd';
import { DownOutlined } from '@ant-design/icons';
import { createStyles } from 'antd-style';

const { TextArea } = Input;

// 默认参数配置
export const defaultModelParams = {
  max_tokens: 2048,
  top_p: 0.7,
  top_k: 66,
  temperature: 0.7,
  frequency_penalty: 0,
  system_prompt: '你是一个有帮助的助手',
  model: 'DeepSeek-R1-N011-Distill-Qwen-7B'
};

const useStyles = createStyles(({ token, css }) => ({
  form: css`
    background: 'rgba(255, 255, 255, 0.1)';
    padding: '12px';
    borderRadius: '8px';
    marginBottom: '12px';
    label,label>.anticon{
      color: #fff !important;
    }
  `
}));

const SettingForm = ({ onChange, initialValues = defaultModelParams }) => {
  const { styles } = useStyles();
  const [form] = Form.useForm();

  const handleValuesChange = (changedValues, allValues) => {
    onChange?.(changedValues, allValues);
  };

  const MODAL_LIST = [
    {
      label: 'DeepSeek-V3',
      value: 'DeepSeek-V3-P001'
    },
    {
      label: 'DeepSeek-R1',
      value: 'DeepSeek-R1-P001'
    },
    {
      label: 'DeepSeek-R1-N011-Distill-Qwen-7B',
      value: 'DeepSeek-R1-N011-Distill-Qwen-7B'
    },
    {
      label: 'DeepSeek-R1-N011-Distill-Llama-8B',
      value: 'DeepSeek-R1-N011-Distill-Llama-8B'
    },
  ]

  return (
    <Form
      form={form}
      layout="vertical"
      initialValues={initialValues}
      onValuesChange={handleValuesChange}
      size="medium"
      className={styles.form}
    >
      <Form.Item
        label="Model"
        name="model"
        tooltip="选择要使用的模型"
      >
        <Select
          placeholder="请选择模型"
          options={MODAL_LIST}
          style={{ width: '100%' }}
        />
      </Form.Item>
      <Form.Item
        label="System Prompt"
        name="system_prompt"
        tooltip="设置AI助手的系统提示词"
      >
        <TextArea
          rows={3}
          placeholder="输入系统提示词"
        />
      </Form.Item>
      
      <Form.Item
        label="Max Tokens"
        name="max_tokens"
        tooltip="生成文本的最大长度"
      >
        <InputNumber
          min={1}
          max={4096}
          style={{ width: '100%' }}
        />
      </Form.Item>
      
      <Form.Item
        label="Temperature"
        name="temperature"
        tooltip="值越大，回答越随机"
      >
        <InputNumber
          min={0}
          max={2}
          step={0.1}
          style={{ width: '100%' }}
        />
      </Form.Item>
      
      <Form.Item
        label="Top P"
        name="top_p"
        tooltip="核采样阈值"
      >
        <InputNumber
          min={0}
          max={1}
          step={0.1}
          style={{ width: '100%' }}
        />
      </Form.Item>
      <Form.Item
        label="Top K"
        name="top_k"
        tooltip="最高k个词的概率"
      >
        
        <InputNumber
          min={0}
          max={100}
          step={1}
          style={{ width: '100%' }}
        />
      </Form.Item>
      
      <Form.Item
        label="Frequency Penalty"
        name="frequency_penalty"
        tooltip="重复惩罚度"
      >
        <InputNumber
          min={-2}
          max={2}
          step={0.1}
          style={{ width: '100%' }}
        />
      </Form.Item>
    </Form>
  );
};

export default SettingForm;
